/* eslint-disable */
//查询结果模块
<template>
	<div>	
		<el-row class="row" >
			<el-col :span="1"  class="table_header bg-gray">诊断</el-col>
			<el-col :span="23" class="bg_lightgray">
				<el-row class="diagnose_container">
					<el-col  v-for="i in data.diagnose.slice(0,5)" >
						<span class="diagnose_block" v-if="i.length>0">{{i}}</span>
					</el-col>
				</el-row>
				
				<el-row class="status">
					<el-col v-if="data.status">
						<StatusCheckBox :disabled="true" :data="data.status"></StatusCheckBox>
					</el-col>
				</el-row>
			</el-col>
		</el-row>
		
		<el-row class="row">
			<el-col :span="1" class="table_header bg-purple">检查</el-col>
			<el-col :span="19" class="bg_white">
				<el-row class="item_row" v-for="item in data.MLS.slice(0,3)">
					<el-col class="col">
						{{item.name}}
					</el-col>
				</el-row>
			</el-col>
			<el-col class="bg-purple" :span="4">
				<el-row class="positive right-col" v-for="item in data.MLS.slice(0,3)">
					<el-col class="bg-pink" v-if="item.positive">阳性</el-col >
					<el-col v-else>阴性</el-col >
				</el-row>
			</el-col>
		</el-row>
		
		<el-row class="row">
			<el-col :span="1"  class="table_header bg-gray">用药</el-col>
			<el-col class="bg_lightgray" :span="19">
				<el-row class="item_row" v-for="i in 3">
					<el-col class="col">
						{{data.medicines[i-1].name}}
					</el-col>
				</el-row>
			</el-col>
			<el-col class="bg_lightgray" :span="4">
				<el-row v-for="i in 3" class="item_row">
					<el-col class="right-col">
						{{data.medicines[i-1].dosis}}{{data.medicines[i-1].unit}}
					</el-col>
				</el-row>
			</el-col>
		</el-row>
		
	</div>
</template>

<script>
import StatusCheckBox from './StatusCheckBox.vue'
	
export default {
	
  /*
  * 组件名
  */
  name: 'DetailTable',
  
  /*
   * 使用的子组件
   */
  components: {
  	StatusCheckBox
  },
  
  /*
  * 向组件外部暴露的变量
  */
  props: {
    data: Object
  },
  
  /*
  * 组件数据
  */
  data(){
    return{
		
    }
  },
  
  /*
  * 组件内部方法
  */
  methods:{
	  
  },
  
  
  /*
  * 生命周期函数,页面创建时调用
  */
  created(){

  }
}
</script>

<!-- 组件内部样式 -->
<style scoped>
	
 .row{
	 border:1px #ededed solid;
	 height: 80px;
	 margin: -1px;
 }
 
 .positive{
	 text-align: center;
	 font-weight: bold;
	 font-size: 16px;
	 height: 34%;
 }
 
 .item_row{
	height:34% ;
	border-bottom: 1px #ededed solid;
 }
 
 .table_header{
	padding-right: 8px;
	text-align: center;
	font-weight: bold;
	writing-mode: tb-rl; /*竖排文字*/
	vertical-align: text-top;
 }
 
 .col{
	 margin-left: 10%;
	 font-family: Microsoft YaHei UI;
	 font-style: normal;
	 font-weight: bold;
	 font-size: 16px;
	 line-height: 25px;
 }

.right-col{
	text-align: center;
	border-bottom: 1px #ededed solid;
	font-size: 16px;
}

.diagnose_container{
	width: 90%;
	display: inline-block;
	height: 50%;
	margin-top: 10px;
	margin-left: 20px;
}

.diagnose_block{
	display: inline-block;
	background-color: white;
	border-radius: 2px;
	margin-right: 20px;
	font-size: 16px;
	padding: 8px;
}

.status{
	margin-left:20px;
	display: inline-block;
	height: 50%;
}

.bg_lightgray{
	background: #F3F3F3;
}

.bg_white{
	background-color: #FFFFFF;
}



</style>
